<template>
	<view>
		<u-popup v-model="showpop" mode="center" border-radius="38" :mask-close-able="false">
			<view class="popbox">
				<view class="poptitle">温馨提示</view>
				<view class="pop-cen">尊敬的用户，我们非常重视您的个人隐私。 为了更好地保护您的个人信息，我们需要您同意我们收集、使用和保护您的个人信息。
					我们将严格遵守相关法律法规，保护您的个人信息安全。 如果您同意我们的<span class="xieyi">《用户协议》</span>及<span
						class="xieyi">《隐私政策》</span>，请点击“同意”按钮。如果您不同意，我们将无法为您提供服务。</view>
				<view class="pop-btn" @click="submit">同意</view>
				<navigator open-type="exit" target="miniProgram" class="pop-nobtn">不同意</navigator>
			</view>
		</u-popup>
		<view class="top">
			<view class="shop">
				<view style="padding-top: 10px;display: flex;">
					<view class="shop-img">
						<image src="https://gongxiangtaiqiu.axa2.com/taiqiu/shop.png" style="width:100%;height: 100%;">
						</image>
					</view>
					<view class="shop-name">
						{{shoplist.has_shop.f_shop_name?shoplist.has_shop.f_shop_name:''}}
					</view>
				</view>
			</view>
			<view class="inform">
				<view class="inform-lf">
					<view style="max-width: 200px; white-space: nowrap; overflow: hidden;  text-overflow: ellipsis;">
						{{shoplist.f_eq_name?shoplist.f_eq_name:''}}
					</view>
					<view class="inform-cen">
						<view class="cen-p">
							桌台
						</view>
					</view>
				</view>
				<view class="inform-rg">
					{{shoplist.f_eq_no?shoplist.f_eq_no:''}}
				</view>
			</view>
			<view class="price-lf" style="margin-left: 20px; margin-top: 10px;">
				收费规则
			</view>
			<view class="price">
				<view class="price-rg">
					<view class="" style="display: flex;justify-content: flex-end;" v-for="(item,index) in ruleList">
						<view class="time">
							时段{{index+1}}：{{item.f_start}}-{{item.f_end}} &nbsp; {{item.f_money}}元/小时
						</view>

					</view>
					<view style="margin-top: 5px;">按分钟收费，结算后，多余押金自动退回</view>
				</view>
			</view>
		</view>
		<!-- <view class="discount">
			<view class="dis-shell">
				<view class="discount-lf">
					优惠券
					<view class="" style="width: 30rpx; height: 23rpx; margin-left: 10rpx;">
						<image src="https://gongxiangtaiqiu.axa2.com/taiqiu/youhui.png" style="width:100%;height: 100%;">
						</image>
					</view>
				</view>
				<view class="" style="display: flex;">
					<view class="discount-rg">
						暂无优惠券
					</view>
					<view>
						<u-icon name="arrow-right" style="display: inline;"></u-icon>
					</view>
				</view>
			</view>
		</view> -->
		<view class="discount">
			<view class="dis-shell">
				<view class="discount-lf">
					支付方式
				</view>
				<view class="" style="display: flex;">
					<view class="discount-rg" style="width: 100px;">
						微信/余额支付
					</view>

				</view>
			</view>
		</view>
		<view class="discount">
			<view class="" style="display: flex; margin-left: 10px; padding-top: 15px;">
				<view style="width: 32rpx; height: 28rpx;margin-right: 10rpx;">
					<image src="https://gongxiangtaiqiu.axa2.com/taiqiu/speak.png" style="width:100%;height: 100%;">
					</image>
				</view>
				<view class="notice">
					充值成为会员，享更多优惠
				</view>
			</view>
			<view class="notice-bg" @click="jumpRecharge(shoplist)">
				<view class="bg-content">
					会员免押金，台费低至5折
				</view>
				<view class="bg-btn">
					<view class="btn-p">
						成为会员
					</view>
				</view>
			</view>
			<view class="tip">
				<view class="tip-box">
					<view style="width: 28rpx; height: 28rpx;margin-right: 10rpx;">
						<image src="https://gongxiangtaiqiu.axa2.com/taiqiu/lianx.png" style="width:100%;height: 100%;">
						</image>
					</view>
					<view class="tip-p">
						如有疑问请联系店长
					</view>

				</view>
				<view style="margin-left: 20rpx;font-size: 27rpx;">其他开台方式</view>
				<view class="btnbox">
					<view class="btn-shell" @click="jumpApp(1)" v-if="tel">
						<view style="width: 40rpx; height: 40rpx;">
							<image src="https://gongxiangtaiqiu.axa2.com/taiqiu/douyin_icon.png"
								style="width: 100%; height: 100%;"></image>
						</view>
						<view style="margin-left: 16rpx;font-size: 27rpx;">
							抖音验劵开台
						</view>
					</view>
					<view class="btn-shell" @click="jumpApp(2)" v-if="tel">
						<view style="width: 50rpx; height: 50rpx;">
							<image src="https://gongxiangtaiqiu.axa2.com/taiqiu/meituan_icon.png"
								style="width: 100%; height: 100%;"></image>
						</view>
						<view style="margin-left: 16rpx;font-size: 27rpx;">
							美团验劵开台
						</view>
					</view>
					<!-- 没有手机号 -->
					<button class="btn-shellss" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" v-if="!tel">
						<view style="width: 40rpx; height: 40rpx;">
							<image src="https://gongxiangtaiqiu.axa2.com/taiqiu/douyin_icon.png"
								style="width: 100%; height: 100%;"></image>
						</view>
						<view style="margin-left: 16rpx;font-size: 27rpx;">
							抖音验劵开台
						</view>
					</button>
					<button class="btn-shellss" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" v-if="!tel">
						<view style="width: 50rpx; height: 50rpx;">
							<image src="https://gongxiangtaiqiu.axa2.com/taiqiu/meituan_icon.png"
								style="width: 100%; height: 100%;"></image>
						</view>
						<view style="margin-left: 16rpx;font-size: 27rpx;">
							美团验劵开台
						</view>
					</button>

				</view>
			</view>
		</view>
		<view class="pay">
			<view class="pay-lf">
				<view class="pay-img">
					<view class="img-p">
						押金可退
					</view>
				</view>
				<view class="cashpledge">
					<view style="font-size: 10px;display: inline">￥</view>{{cash}}
					<view style="font-size: 10px;display: inline;color: #F9AF29; margin-left: 10rpx;">押金</view>
				</view>
				<view class="cash-tip">
					结算台费后，剩余费用自动退回
				</view>
			</view>
			<view class="pay-rg" v-if="tel">
				<view class="pay-btn" @click="openpay" v-if="isloding==false">
					<view class="pay-p">
						确认开台
					</view>
				</view>
				<view class="pay-btn11" v-if="isloding==true">
					<view class="pay-p">
						确认开台
					</view>
				</view>
			</view>
			<view class="pay-rg" v-if="!tel">
				<button class="pay-btn" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
					<view class="pay-p">确认开台</view>
				</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isloding: false,
				codelist: {},
				background: '#ffffff',
				shoplist: {},
				cash: '',
				shop_id: '',
				shopname: '',
				ruleList: {},
				scene: '',
				orderId: '',
				shopnewid: '',
				leftMoney: '',
				type: '',
				ioId: '',
				showpop: false,
				tel: uni.getStorageSync('phoneNumber'),
				user_info: {}
			}
		},
		onLoad(option) {
			console.log(this.tel, 'tel  phoneNumber缓存')
			this.scene = option.scene
			console.log(this.scene, 'onLoad')
			if (!uni.getStorageSync('token')) {
				this.showpop = true
			}
			// if (!uni.getStorageSync('token')) {
			// 	uni.navigateTo({
			// 		url: '/pagesB/login/login'
			// 	})
			// } else {
			this.$Api.getEqInfoForCode({
				code: option.scene
			}).then(res => {
				console.log(res.data.data.id, res.data.data.f_eq_type, 'getEqInfoForCode')
				this.ioId = res.data.data.id
				this.type = res.data.data.f_eq_type
				if (res.data.code == 1001) {
					let item = res.data.data
					uni.navigateTo({
						url: '/pagesB/settle/settle?id=' + item.orderId + '&shopid=' + item.shopId +
							'&f_use_long=' + item.useLong
					})
				} else {
					this.shoplist = res.data.data
					this.shop_id = res.data.data.f_shop_id
					console.log(this.shop_id, '店铺id onload')
					if (option) {
						//押金获取
						let that = this
						that.$Api.getCashPledge({
							shopId: that.shop_id,
							type: this.type,
							userId: uni.getStorageSync('userid'),
						}).then(res => {
							that.cash = res.data.data.f_cash_pledge
							that.leftMoney = res.data.leftMoney
						})
					}
					this.rule()
				}
			});

			// }
		},
		onShow() {
			console.log(this.scene, 'onShow')
			if (!uni.getStorageSync('token')) {
				this.showpop = true
			}
			this.$Api.getEqInfoForCode({
				code: this.scene
			}).then(res => {
				this.ioId = res.data.data.id
				this.type = res.data.data.f_eq_type
				if (res.data.code == 1001) {
					let item = res.data.data
					uni.navigateTo({
						url: '/pagesB/settle/settle?id=' + item.orderId + '&shopid=' + item.shopId +
							'&f_use_long=' + item.useLong
					})
				} else {
					this.shoplist = res.data.data
					this.shop_id = res.data.data.f_shop_id
					console.log(this.shop_id, '店铺id onshow')
					//押金获取
					this.$Api.getCashPledge({
						shopId: this.shop_id,
						type: this.type,
						userId: uni.getStorageSync('userid'),
					}).then(res => {
						console.log(res, '押金获取111111111111111111111111');
						this.cash = res.data.data[0].f_cash_pledge
					})
					this.rule()
				}
			});
			// }
			// this.$Api.getEqInfoForCode({
			// 	code: this.scene
			// }).then(res => {
			// 	if (res.data.code == 1001) {
			// 		let item = res.data.data
			// 		uni.navigateTo({
			// 			url: '/pagesB/settle/settle?id=' + item.orderId + '&shopid=' + item.shopId +
			// 				'&f_use_long=' + item.useLong
			// 		})
			// 	} else {
			// 		console.log(res, '111111111111111111');
			// 		this.shoplist = res.data.data
			// 		this.shop_id = res.data.data.f_shop_id

			// 		//押金获取
			// 		this.$Api.getCashPledge({
			// 			shopId: this.shop_id,
			// 			userId: uni.getStorageSync('userid'),
			// 		}).then(res => {
			// 			console.log(res, '押金获取111111111111111111111111');
			// 			this.cash = res.data.data.f_cash_pledge
			// 		})

			// 		this.rule()
			// 	}
			// });


		},
		methods: {
			//获取登录信息
			submit() {
				uni.getUserProfile({
					desc: '用于完善会员资料',
					lang: 'zh_CN',
					success: (res) => {
						this.userInfo = res.userInfo
						// this.userInfo.avatarUrl = this.avatar
						// this.userInfo.nickName = this.name
						uni.login({
							provider: 'weixin',
							success: async (loginRes) => {
								console.log('获取code和用户信息', loginRes.code, JSON.stringify(this
									.userInfo))
								let user_info = JSON.stringify(this.userInfo)
								let code = loginRes.code
								this.$Api.wxLogin({
									code: code,
									user_info: user_info
								}).then(res => {
									console.log(this.userInfo)
									console.log(res, '这是啥')
									uni.setStorageSync('token', res.data.data.opinfo
										.token);
									uni.setStorageSync('userid', res.data.data.opinfo
										.userId);
									uni.setStorageSync('phoneNumber', res.data.data.info
										.f_phone);
									this.showpop = false
									// uni.navigateBack({
									// 	delta: 1
									// })
								}, err => {
									uni.showModal({
										title: 'none',
										content: `${JSON.stringify(err)} fail`
									})
								})
							},
							fail: function(err) {
								uni.showToast({
									icon: 'none',
									title: 'fail2'
								})
							}
						});
					}
				})

			},
			// 手机号授权
			getPhoneNumber(e) {
				console.log(e.detail.errMsg) // 判断用户是否允许获取手机号
				console.log(e);
				this.$Api.getUserPhone({
					userId: uni.getStorageSync('userid'),
					edata: e.detail.encryptedData,
					iv: e.detail.iv
				}).then(res => {
					console.log(res.data.data.phoneNumber, '获取手机号')
					
					uni.setStorageSync('phoneNumber', res.data.data.phoneNumber);
					this.tel = res.data.data.phoneNumber

				}, err => {})
			},
			//验劵
			jumpApp(typeApp) {
				uni.navigateTo({
					url: '/pagesB/selfcheck/selfcheck?shop_id=' + this.shop_id + '&eqId=' + this.shoplist.f_eq_id +
						'&eqNo=' + this.shoplist.f_eq_no + '&typeApp=' + typeApp
				})
			},
			//跳转充值
			jumpRecharge(shoplist) {
				uni.navigateTo({
					url: '/pagesB/rechargeAmount/rechargeAmount?id=' + this.shoplist.has_shop.id + '&name=' + this
						.shoplist.has_shop.f_shop_name
				})
			},
			//根据设备获取规则
			rule() {
				this.$Api.getEqRule({
					shopId: this.shop_id,
					ioId: this.ioId
				}).then(res => {
					this.ruleList = res.data.data
					console.log(res.data, '规则列表')
				})
			},
			openpay() {
				//先获取手机号
				if (!uni.getStorageSync('phoneNumber')) {
					return
				}
				// this.isloding = true
				console.log(this.isloding, 'this.isloding哈哈哈')
				uni.showModal({
					title: '开台',
					content: '您确认开台么？',
					confirmText: "确定", // 确认按钮的文字  
					cancelText: '取消', //取消按钮
					showCancel: true, // 是否显示取消按钮，默认为 true
					cancelColor: '#a3aeaf',
					confirmColor: '#02FF83',
					success: (res) => {
						if (res.confirm) {
							console.log('走了')
							//获取押金
							this.$Api.getCashPledge({
								shopId: this.shop_id,
								type: this.type,
								userId: uni.getStorageSync('userid'),
							}).then(res => {
								this.cash = res.data.data[0].f_cash_pledge
								this.leftMoney = res.data.leftMoney
								console.log(Number(this.cash), Number(this.leftMoney), '押金 余额')
								//如果押金大于余额 弹弹窗充值或者交押金
								if (Number(this.cash) > Number(this.leftMoney)) {
									uni.showModal({
										title: '余额不足',
										content: '您的会员卡余额不足是否充值？',
										confirmText: "去充值", // 确认按钮的文字  
										cancelText: '交押金', //取消按钮
										showCancel: true, // 是否显示取消按钮，默认为 true
										confirmColor: '#02FF83',
										cancelColor: '#02FF83',
										success: (res) => {
											if (res.confirm) {
												console.log('comfirm', this.shoplist) //点击确定之后执行的代码
												uni.navigateTo({
													url: '/pagesB/rechargeAmount/rechargeAmount?id=' + this
														.shoplist.has_shop.id + '&name=' + this.shoplist
														.has_shop.f_shop_name
												})
											} else {
												console.log('cancel')
												//创建订单
												this.$Api.createOrder({
													userId: uni.getStorageSync('userid'),
													eqId: this.shoplist.f_eq_id, //设备id
													eqNo: this.shoplist.f_eq_no, //设备编号
												}).then(res => {
													console.log(res.data.orderId, '000')
													this.orderId = res.data.orderId
													this.shopnewid = res.data.shopId
													if (res.data.code == 0) {
														console.log('111111')
														uni.navigateTo({
															url: '/pagesB/opensuccess/opensuccess?cash=' +
																this
																.cash + '&orderId=' + this
																.orderId + '&shopId=' + this
																.shopnewid
														})
														this.isloding = false
													} else if (res.data.code == 2) {
														console.log(res.data.orderId, '222222222')
														let that = this
														uni.requestPayment({
															provider: 'wxpay', //支付类型-固定值
															timeStamp: res.data.data.timeStamp
																.toString(), // 时间戳（单位：秒）
															nonceStr: res.data.data
																.nonceStr, // 随机字符串
															package: res.data.data.package, // 固定值
															signType: res.data.data.signType, //固定值
															paySign: res.data.data.sign, //签名
															success: function(res) {
																console.log("支付成功");
																uni.showToast({
																	icon: 'success',
																	title: '支付成功'
																})
																setTimeout(() => {
																	uni.navigateTo({
																		url: '/pagesB/opensuccess/opensuccess?cash=' +
																			that
																			.cash +
																			'&orderId=' +
																			that
																			.orderId +
																			'&shopId=' +
																			that
																			.shopnewid
																	})
																}, 1000)
															},
															fail: function(err) {
																this.isloding = false
																console.log('fail:' + JSON
																	.stringify(err));
																console.log("支付失败");
																uni.showToast({
																	icon: 'none',
																	title: '支付失败'
																})
															}
														});
													} else if (res.data.code == 1) {
														uni.showToast({
															title: res.data.data,
															icon: "none"
														})
													}
												});
							
											}
										}
									})
								} else {
									this.isloding = true
									this.$Api.createOrder({
										userId: uni.getStorageSync('userid'),
										eqId: this.shoplist.f_eq_id, //设备id
										eqNo: this.shoplist.f_eq_no, //设备编号
									}).then(res => {
										console.log(res.data.orderId, '000')
										this.orderId = res.data.orderId
										this.shopnewid = res.data.shopId
										if (res.data.code == 0) {
											console.log('111111')
											uni.navigateTo({
												url: '/pagesB/opensuccess/opensuccess?cash=' + this
													.cash + '&orderId=' + this
													.orderId + '&shopId=' + this.shopnewid
											})
										} else if (res.data.code == 2) {
											console.log(res.data.orderId, '222222222')
											let that = this
											uni.requestPayment({
												provider: 'wxpay', //支付类型-固定值
												timeStamp: res.data.data.timeStamp
													.toString(), // 时间戳（单位：秒）
												nonceStr: res.data.data.nonceStr, // 随机字符串
												package: res.data.data.package, // 固定值
												signType: res.data.data.signType, //固定值
												paySign: res.data.data.sign, //签名
												success: function(res) {
													console.log("支付成功");
													// this.isloding = false
													uni.showToast({
														icon: 'success',
														title: '支付成功'
													})
													setTimeout(() => {
														uni.navigateTo({
															url: '/pagesB/opensuccess/opensuccess?cash=' +
																that.cash +
																'&orderId=' +
																that.orderId +
																'&shopId=' +
																that.shopnewid
														})
													}, 1000)
												},
												fail: function(err) {
													console.log('fail:' + JSON.stringify(err));
													console.log("支付失败");
													this.isloding = false
													uni.showToast({
														icon: 'none',
														title: '支付失败'
													})
												}
											});
										} else if (res.data.code == 1) {
											uni.showToast({
												title: res.data.data,
												icon: "none"
											})
											// this.isloding = false
										}
									});
								}
							})
										
						}
					}
				})
				
			},


		}
	}
</script>

<style lang="scss">
	page {
		background-color: #F8F8F8;
	}

	.xieyi {
		color: #222222;
		font-weight: 600;
	}

	.popbox {
		width: 335px;
		height: 305px;
		background-color: #ffffff;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;

		.poptitle {
			height: 25px;
			color: #222222;
			font-size: 18px;
			font-weight: 600;
			margin-top: 18px;
		}

		.pop-cen {
			color: #737373;
			font-size: 14px;
			padding: 17px;
		}

		.pop-btn {
			width: 280px;
			height: 45px;
			background-color: #4EDB9D;
			color: #ffffff;
			border-radius: 25px;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 15px;
			font-weight: 600;
			letter-spacing: 2px;
		}

		.pop-nobtn {
			// width: 280px;
			height: 45px;
			border-radius: 25px;
			color: #9d9d9d;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 15px;
			letter-spacing: 2px;
		}
	}


	.btnbox {
		width: 89%;
		height: 60px;
		margin: auto;
		display: flex;
		justify-content: space-between;
		align-items: center;

		.btn-shell {
			width: 48%;
			height: 33px;
			border: 1px solid #1bda6e;
			border-radius: 50px;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.btn-shellss {
			width: 48%;
			// height: 33px;
			border: 1px solid #1bda6e;
			border-radius: 50px;
			display: flex;
			justify-content: center;
		}
	}

	.pay {
		width: 750rpx;
		height: 160rpx;
		background: #FFFFFF;
		position: absolute;
		bottom: 0;
		display: flex;
		justify-content: space-between;
		align-items: center;

		.cashpledge {
			// width: 150rpx;
			height: 36rpx;
			font-size: 36rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #222222;
			margin-top: 30rpx;
		}

		.cash-tip {
			// width: 306rpx;
			height: 23rpx;
			font-size: 22rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #666666;
			margin-top: 20rpx;
		}

		.pay-img {
			width: 122rpx;
			height: 50rpx;
			background-image: url('https://gongxiangtaiqiu.axa2.com/taiqiu/yajin.png');
			background-size: 100% 100%;
			display: flex;
			justify-content: center;
			position: absolute;
			top: -10px;

			.img-p {
				font-size: 22rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #FFFFFF;
			}
		}

		.pay-lf {
			width: 390rpx;
			height: 160rpx;
			margin-left: 20px;
		}

		.pay-rg {
			width: 300rpx;
			height: 160rpx;
			display: flex;
			justify-content: center;
			align-items: center;

			.pay-btn {
				width: 280rpx;
				height: 88rpx;
				background: #222222;
				border-radius: 44rpx;
				display: flex;
				justify-content: center;
				align-items: center;

				.pay-p {
					font-size: 30rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #02FF83;
				}
			}
			.pay-btn11 {
				width: 280rpx;
				height: 88rpx;
				background: #bebebe;
				border-radius: 44rpx;
				display: flex;
				justify-content: center;
				align-items: center;
			
				.pay-p {
					font-size: 30rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #ffffff;
				}
			}
		}
	}

	.top {
		width: 100%;
		// height: 330rpx;
		background-color: #ffffff;

		.shop {
			width: 100%;
			height: 30rpx;
			// margin-top: 200rpx;
			display: flex;

			.shop-img {
				width: 30rpx;
				height: 30rpx;
				background-color: aquamarine;
				margin-left: 40rpx;
			}

			.shop-name {
				// width: 138rpx;
				height: 26rpx;
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #222222;
				margin-left: 10rpx;
			}
		}

		.inform {
			width: 690rpx;
			height: 111rpx;
			background: #EDF9F5;
			border-radius: 8rpx;
			margin: auto;
			margin-top: 50rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.inform-lf {
				width: 500rpx;
				font-size: 32rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #222222;
				margin-left: 10rpx;
				display: flex;
				flex: 1;
				// justify-content: space-between;
				// white-space: nowrap;
				// overflow: hidden;
				// text-overflow: ellipsis;
			}

			.inform-cen {
				width: 106rpx;
				height: 44rpx;
				background: #FFFFFF;
				border: 2px solid #19C865;
				border-radius: 8rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				margin-left: 20px;

				.cen-p {
					// width: 60rpx;
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #19C865;
				}
			}

			.inform-rg {
				width: 86rpx;
				height: 28rpx;
				font-size: 36rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #222222;
				display: flex;
				flex: 1;
				justify-content: flex-end;
				padding-right: 20px;
			}
		}

		.price {
			width: 650rpx;
			border-radius: 8rpx;
			height: auto;
			margin: auto;
			margin-top: 30rpx;
			display: flex;
			padding-bottom: 25px;
			justify-content: space-between;
			align-items: center;

			.price-lf {
				// width: 101rpx;
				height: 76rpx;
				font-size: 26rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #6B6B6B;
			}

			.price-rg {
				// width: 394rpx;
				font-size: 22rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #999999;
				display: flex;
				flex-direction: column;
				align-items: flex-start;

				.time {
					height: 27rpx;
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #222222;
					line-height: 20rpx;
					text-align: right;
					margin-right: 10rpx;
					margin-top: 18rpx;
				}
			}
		}
	}

	.discount {
		width: 100%;
		// height: 98rpx;
		background: #FFFFFF;
		margin-top: 15rpx;

		.tip {
			.tip-box {
				width: 100%;
				display: flex;
				padding-top: 30rpx;
				height: 80rpx;
				background: #ffffff;
				padding-left: 18rpx;
			}

			.tip-p {
				// width: 197rpx;
				height: 22rpx;
				font-size: 22rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #999999;
			}
		}

		.notice-bg {
			width: 690rpx;
			height: 111rpx;
			background-image: url('https://gongxiangtaiqiu.axa2.com/taiqiu/vipbg.png');
			background-size: 100% 100%;
			margin: auto;
			margin-top: 30rpx;
			display: flex;
			justify-content: center;
			align-items: center;

			.bg-content {
				width: 384rpx;
				height: 31rpx;
				font-size: 32rpx;
				font-family: DingTalk JinBuTi;
				font-weight: 400;
				color: #222222;
			}

			.bg-btn {
				width: 200rpx;
				height: 60rpx;
				background: #EDF9F5;
				box-shadow: 0px 0px 9px 1px rgba(64, 201, 149, 0.3);
				border-radius: 30rpx;
				display: flex;
				justify-content: center;
				align-items: center;

				.btn-p {
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #222222;
				}
			}

		}

		.notice {
			// width: 310rpx;
			height: 27rpx;
			font-size: 26rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #F9AF29;
		}

		.dis-shell {
			width: 690rpx;
			height: 111rpx;
			margin: auto;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.discount-lf {
				width: 120rpx;
				font-size: 26rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #6B6B6B;
				display: flex;
			}

			.discount-rg {
				// width: 128rpx;
				font-size: 26rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #222222;
			}
		}
	}
</style>